<template>
  <div class="login">
    <login-page title="重置登录密码">
      <div class="input-item">
        <input-text icon='iconfont icon-shenfenzheng' text='用户名' type='text'></input-text>
        <input-text icon='iconfont icon-suo' text='密码' type='password'></input-text>
        <input-text icon='iconfont icon-suo' text='确认密码' type='password'></input-text>
        <input-yan-zheng icon='iconfont icon-wancheng' text='验证码'></input-yan-zheng>
      </div>
      <div class="input-item">
        <input-button text='修改' color='#fb7d3f'></input-button>
        <input-button text='返回' @click.native="$router.go(-1);"></input-button>
      </div>
      <div class="input-item">
        <login-link to1='/Sign' to2='/' text1='注册' text2='登录'></login-link>
      </div>
    </login-page>
  </div>
</template>

<script>
import LoginPage from "../Common/LoginPage";
import InputText from "../Common/InputText";
import InputButton from "../Common/InputButton";
import LoginLink from "../Common/LoginLink";
import InputYanZheng from "../Common/InputYanZheng";
export default {
  name: "HelloWorld",
  data() {
    return {
      msg: "Welcome to Your Vue.js App"
    };
  },
  methods: {
    login() {
      this.$router.push("/home");
    }
  },
  components: {
    "login-page": LoginPage,
    "input-text": InputText,
    "input-button": InputButton,
    "login-link": LoginLink,
    "input-yan-zheng": InputYanZheng
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
@import "./css/index.css";
</style>
